<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:insert="~{common/header::head}"></th:block>
    <link rel="stylesheet" type="text/css" th:href="@{/css/main.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/css/poetry.css}">
    <script type="text/javascript" charset="utf-8" th:src="@{/js/poetry.js}"></script>
    <title th:text="'《'+${poetry.poetryTitle}+'》诗词详情-云沾衣诗词网-入云深处亦沾衣'">云沾衣诗词网-入云深处亦沾衣</title>


</head>
<body>
<div th:insert="~{common/header :: home_nav}"></div>

<div class="container full">
    <div class="row">
        <div class="col-sm-12 col-lg-9">
            <div class="card">
                <div class="card-header stress">
                    诗词原文
                </div>
                <div class="card-body">
                    <div style="font-weight: bold;font-size: x-large" th:text="${poetry.poetryTitle}"></div>
                    <div style="margin-top: 20px;margin-bottom: 20px ">
                        [<a style="color: #580000" target="_blank"
                            th:href="@{/index/poetry/(dynasty=${poetry.dynastyId})}"
                            th:text="${poetry.poetryDynasty}"></a>]
                        <a style="color: #580000" th:href="@{'/author/'+${poetry.authorId}}"
                           th:text="${poetry.poetryAuthor}"
                        ></a>
                    </div>
                    <div style="font-size: large; line-height: 1.5;">
                    <span th:text="${poetry.poetryContent}" style="white-space: pre-wrap;">
                    </span>
                    </div>
                    <div style="margin-top: 20px">
                        <th:block th:each="tag : ${poetry.tagList}">
                            <a th:href="@{/index/poetry(tag=${tag.tagId})}" th:text="${tag.tagName}"
                               class="badge rounded-pill btn-primary">成功</a>
                        </th:block>
                    </div>
                </div>

                <div class="card-footer">

                    <div class="float">
                        <div th:text="${poetry.collection}?'已收藏':'收藏'" th:onclick="|collection(${poetry.poetryId})|"
                             id="collection" class="float-btn">
                            收藏
                        </div>
                        <div class="float-btn" onclick="showPerfectModel()">
                            完善
                        </div>
                    </div>
                </div>
            </div>

            <th:block th:each="item : ${poetry.poetryDetails}">
                <div class="card">
                    <div th:text="${item.detailType}" class="card-header stress">
                    </div>
                    <div class="card-body">
                  <span th:text="${item.detailContent}" style="white-space: pre-wrap; line-height: 1.5;">
                    </span>
                    </div>

                </div>
            </th:block>

        </div>
        <div class="col-lg-3 col-sm-auto">
            <div class="card">
                <div class="card-header stress">
                    作者卡片
                </div>
                <div class="card-body">
                    <div style="text-align: center;margin: 5px">
                        <div>
                            <a th:href="@{'/author/'+${poetry.author.id}}"
                               th:text="${poetry.author.authorName}"
                               style="font-size: 22px;"> </a>
                        </div>
                        <div>
                            朝代 : <a style="color: #580000"
                                    th:href="@{/index/author/(dynasty=${poetry.author.dynastyId})}"
                                    th:text="${poetry.author.authorDynasty}"></a>
                        </div>
                    </div>
                    <span th:text="${poetry.author.info}"></span> <a
                                                                     th:href="@{'/author/poetry/'+${poetry.author.id}}">共收录<span
                        th:text="${poetry.author.recordCount}"></span> 首作品></a>
                </div>
            </div>
            <div th:insert="~{common/common::ghcard}"></div>
        </div>
    </div>
</div>
<!-- 模态框 -->
<div class="modal fade" id="perfectModal">
    <div class="modal-dialog">
        <div class="modal-content">
            <!-- 模态框头部 -->
            <div class="modal-header">
                <h3 class="modal-title" id="perfect-title" th:text="'完善诗词《'+${poetry.poetryTitle}+'》'"></h3>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <!-- 模态框内容 -->
            <div class="modal-body">
                <textarea id="perfect-content" placeholder="输入完善建议" class="form-control" rows="5"
                          name="text"></textarea>
            </div>

            <!-- 模态框底部 -->
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" data-bs-dismiss="modal" onclick="perfect(1)">提交
                </button>
            </div>

        </div>
    </div>
</div>

<div th:insert="~{common/footer ::home-footer}"></div>
</body>
</html>
